<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<ui:composition
	template="/templateadminlte/master/master_template.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.org/ui">

	<ui:define name="content">


		<aside class="right-side"> <!-- Content Header (Page header) -->

		<section class="content-header">
		<div class="aling-left">
			<ol class="breadcrumb-sitemap ol">
				<li><a
					href="${facesContext.externalContext.requestContextPath}/index.xhtml"><i
						class="fa fa-child"></i> Aluno</a> > Matrícula</li>
			</ol>
		</div>
		</section> <!-- Main content --> <section class="content">
		<div class="row">
			<div class="col-md-12">

				<!-- MENU ACCORDION -->

				<div class="box box-primary">
					<div class="box-header collapsed" data-toggle="collapse"
						data-parent="#accordion" href="#collapseOne">

						<h4 class="box-title">
							<i class="fa fa-search" style="margin-right: 3px;"></i><a>Pesquisa</a>
						</h4>
					</div>
					<div id="collapseOne" class="panel-collapse collapse"
						style="height: 0px;">
						<div class="panel-body">Lorem ipsum dolor sit amet,
							consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
							labore et dolore magna aliqua. Ut enim ad minim veniam, quis
							nostrud exercitation ullamco laboris nisi ut aliquip ex ea
							commodo consequat. Duis aute irure dolor in reprehenderit in
							voluptate velit esse cillum dolore eu fugiat nulla pariatur.
							Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
							officia deserunt mollit anim id est laborum.</div>
					</div>
				</div>

				<!-- /. MENU ACCORDION -->

				<!-- MODAL NOVO REGISTRO -->

				<div class="panel-body" style="padding-left: 0px;">
					<button class="btn btn-primary" data-toggle="modal"
						data-target="#myModal">Novo Cadastro</button>
					<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
						aria-labelledby="myModalLabel" aria-hidden="true">

						<div class="modal-dialog">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-hidden="true">×</button>
									<h2 class="modal-title" id="myModalLabel">
										<label>Registro de Matrícula</label>
									</h2>
								</div>
								<div class="modal-body">
									<div class="form-group-modal">
										<p:messages id="messages" />
										<h:form class="form-horizontal" method="post" action=""
											role="form">
											<div class="panel panel-default">
												<div class="panel-heading">
													<label>Data do Registro: 27/02/2015</label>
												</div>
												<div class="panel-body">
													<ul class="nav nav-tabs">
														<li class="active"><a id="abaGerais" href="#dadosGerais"
															data-toggle="tab">Dados Gerais</a></li>
														<li class=""><a id="abaAcomp" href="#acompanhamento"
															data-toggle="tab">Acompanhamento</a></li>
													</ul>

													<div class="tab-content">
														<div class="tab-pane fade active in" id="dadosGerais">
															<div class="row">
																<div class="col-sm-6">
																	<label for="aluno">Aluno</label>
																	<p:inputText styleClass="form-control" id="aluno"
																		placeholder="Nome do aluno" required="true"
																		requiredMessage="Campo Obrigatório" disabled="false" />
																</div>
																<div class="col-sm-3">
																	<label for="telCelAluno">Tel. Celular</label>
																	<p:inputText styleClass="form-control" id="telCelAluno"
																		disabled="true" />
																</div>
																<div class="col-sm-3">
																	<label for="telFixAluno">Tel. Fixo</label>
																	<p:inputText styleClass="form-control" id="telFixAluno"
																		disabled="true" />
																</div>
															</div>
															<br />
															<div class="row">
																<div class="col-sm-2">
																	<label for="idadeAluno">Idade</label>
																	<p:inputText styleClass="form-control" id="idadeAluno"
																		disabled="true" />
																</div>
																<div class="col-sm-6">
																	<label for="endAluno">Endereço</label>
																	<p:inputText styleClass="form-control" id="endAluno"
																		disabled="true" />
																</div>
																<div class="col-sm-4">
																	<label for="bairroAluno">Bairro</label>
																	<p:inputText styleClass="form-control" id="bairroAluno"
																		disabled="true" />
																</div>
															</div>

															<p:separator></p:separator>

															<div class="row">
																<div class="col-sm-4">
																	<label for="oficina">Oficina</label>
																	<p:inputText styleClass="form-control" id="oficina"
																		placeholder="Nome do oficina" required="true"
																		requiredMessage="Campo Obrigatório" disabled="false" />
																</div>
																<div class="col-sm-6">
																	<label for="oficineiro">Oficineiro</label>
																	<p:inputText styleClass="form-control" id="oficineiro"
																		disabled="true" />
																</div>
																<div class="col-sm-2">
																	<label for="vagasOficina">Vagas</label>
																	<p:inputText styleClass="form-control"
																		id="vagasOficina" disabled="true" />
																</div>
															</div>
															<br />
															<div class="row">
																<div class="col-sm-4">
																	<label for="horarioOficina">Horário</label>
																	<p:inputText styleClass="form-control"
																		id="horarioOficina" disabled="true"
																		value="Seg e Ter - 10 às 12h" />
																</div>
																<div class="col-sm-6">
																	<label for="endOficina">Endereço</label>
																	<p:inputText styleClass="form-control" id="endOficina"
																		disabled="true" />
																</div>
																<div class="col-sm-2">
																	<label for="bairroOficina">Bairro</label>
																	<p:inputText styleClass="form-control"
																		id="bairroOficina" disabled="true" />
																</div>
															</div>

															<p:separator></p:separator>

															<div class="row">
																<div class="col-sm-3">
																	<label for="opcaoReligiosa">Opção Religiosa</label>
																	<select id="opcaoReligiosa"
																		class="form-control acomp">
																		<option>Selecione</option>
																		<option value="ateu">Ateu</option>
																		<option value="catolico">Católico</option>
																		<option value="evangelico">Evangélico</option>
																		<option value="outro">Outro</option>
																	</select>
																</div>
																<div class="col-sm-5">
																	<label for="documento">Documento Oficial</label>
																	<p:inputText styleClass="form-control" id="documento" />
																</div>
																<div class="col-sm-3">
																	<label for="status">Situação</label>
																	<p:selectOneRadio id="status" styleClass="ui-selectoneradio">
																		<f:selectItem itemLabel="Vigente" />
																		<f:selectItem itemLabel="Cancelada" />
																	</p:selectOneRadio>
																</div>
															</div>
															<br />
															<div class="row">
																<div class="col-sm-12">
																	<label for="ind_acompOficina">Indicação/Acompanhamento</label>
																	<p:inputText styleClass="form-control"
																		id="ind_acompOficina" />
																</div>
															</div>

															<div class="row">
																<div class="col-sm-12">
																	<label for="obsOficina">Observações</label>
																	<p:inputTextarea styleClass="form-control"
																		id="obsOficina" autoResize="false" />
																</div>
															</div>
														</div>
														<div class="tab-pane fade" id="acompanhamento">
															<div class="row">
																<div class="col-sm-3">
																	<label>Select</label> <select id="selectEvent"
																		class="form-control acomp">
																		<option>Selecione</option>
																		<option value="fa fa-comments bg-yellow">Atendimento</option>
																		<option value="fa fa-envelope bg-blue">Email</option>
																		<option value="fa fa-user bg-aqua">Observação</option>
																	</select>
																</div>
																<div class="col-sm-5">
																	<label for="descAcompanhamento">Descrição do
																		Acompanhamento</label>
																	<p:inputText styleClass="form-control acomp"
																		id="descAcompanhamento" />
																</div>
																<div>
																	<div>
																		<label>Data</label>
																		<p:calendar id="popup" showOn="button"
																			styleClass="acomp" />
																	</div>
																</div>
															</div>

															<div class="button-acompanhamento">
																<button class="btn btn-success" type="button"
																	id="addEvent" onclick="addAcompanhamento()">
																	<i class="fa fa-th-list"></i> Adicionar Acompanhamento
																</button>
															</div>


															<div class="panel">
																<div class="panel-body fixed-panel">
																	<ul id="ulEvent" class="timeline">
																	</ul>
																</div>
															</div>

														</div>
													</div>
												</div>
											</div>

											<div id="footer">
											<div id="btSaveAndNew" class="form-group">
												<center>
													<div class="col-sm-12">
														<button type="submit" class="btn btn-success">
															<i class="fa fa-plus-square-o fa-2x"></i><span
																class="button-modal"> Salvar e fazer Novo
																cadastro</span>
														</button>
													</div>
												</center>
											</div>
											<div id="modalFooter" class="modal-footer">
												<button type="button" class="btn btn-default"
													data-dismiss="modal">Sair</button>
												<button type="button" class="btn btn-primary">
													<i class="fa fa-check-square-o"></i>Confirmar Cadastro(s)
												</button>
											</div>
											</div>
										</h:form>

									</div>
								</div>

							</div>
						</div>
					</div>
				</div>
				<!-- /. MODAL NOVO REGISTRO -->

				<!-- LISTAGEM DE ALUNOS -->

				<div class="box box-primary">
					<div class="box-header">
						<h4 class="box-title">
							<a>Listagem de Alunos</a>
						</h4>
					</div>
					<div class="box-body">
						<div class="table-responsive">
							<table class="table">
								<thead>
									<tr>
										<th>#</th>
										<th>First Name</th>
										<th>Last Name</th>
										<th>Username</th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<td>1</td>
										<td>Mark</td>
										<td>Otto</td>
										<td>@mdo</td>
									</tr>
									<tr>
										<td>2</td>
										<td>Jacob</td>
										<td>Thornton</td>
										<td>@fat</td>
									</tr>
									<tr>
										<td>3</td>
										<td>Larry</td>
										<td>the Bird</td>
										<td>@twitter</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>

				<!-- /. LISTAGEM DE ALUNOS -->
			</div>
			<!-- /. ROW  -->
		</div>
		</section> <!-- /.content --> </aside>
		<!-- /.right-side -->

		<!-- add new calendar event modal -->
	</ui:define>

</ui:composition>
</html>
